import { defineStore } from 'pinia';
import { ref } from 'vue';

export const useEmojiStore = defineStore('emoji', () => {
  const isEmojiVisible = ref(false);

  const emojiList = ref([
    { name: 'angry-face', path: '/assets/angry-face.a92ee749.png'},
  { name: 'anguished-face', path: '/assets/anguished-face.420e9103.png' },
  { name: 'astonished-face', path: '/assets/astonished-face.eb3e93a6.png' },
  { name: 'bad-two', path: '/assets/bad-two.9a951297.png'},
  { name: 'bless', path: '/assets/bless.2462c3ff.png' },
  { name: 'bye', path: '/assets/bye.b5b52124.png' },
  { name: 'click-tap', path:'/assets/click-tap.865a99fa.png' },
  { name: 'crying-baby', path: '/assets/crying-baby.c6ee1aa4.png' },
  { name: 'disappointed-face', path:'/assets/disappointed-face.e72111d4.png' },
  { name: 'distraught-face', path: '/assets/distraught-face.722bfdcc.png' },
  { name: 'dizzy-face', path: '/assets/dizzy-face.57f5688b.png' },
  { name: 'emotion-happy', path: '/assets/emotion-happy.199655a8.png' },
  { name: 'emotion-unhappy', path: '/assets/emotion-unhappy.a9fd116b.png' },
  { name: 'expressionless-face', path:'/assets/expressionless-face.8ff76b1f.png' },
  { name: 'face-with-smiling-open-eyes', path: '/assets/face-with-smiling-open-eyes.065b658c.png' },
  { name: 'flirt', path: '/assets/flirt.90ae5b7e.png' },
  { name: 'grinning-face-with-squinting-eyes', path: '/assets/grinning-face-with-squinting-eyes.86f12bed.png' },
  { name: 'grinning-face-with-tightly-closed-eyes', path: '/assets/grinning-face-with-tightly-closed-eyes.3d65f876.png' },
  { name: 'loudly-crying-face-whit-open-mouth', path: '/assets/loudly-crying-face-whit-open-mouth.e7b92c80.png' },
  { name: 'middle-finger', path: '/assets/middle-finger.2d7762f0.png' },
  { name: 'pouting-face', path: '/assets/pouting-face.2e0d1879.png' },
  { name: 'respect', path: '/assets/respect.93f3317c.png' },
  { name: 'six', path: '/assets/six.7d330f37.png' },
  { name: 'swing', path: '/assets/swing.f853cff5.png' },
  { name: 'thumbs-up', path: '/assets/thumbs-up.1cb397e7.png'},
  { name: 'upside-down-face', path: '/assets/upside-down-face.15ad35d5.png' },
  { name: 'winking-face-with-open-eyes', path: '/assets/winking-face-with-open-eyes.258fafe4.png' },
  { name: 'yep', path: '/assets/yep.a3cc1340.png'},
  { name: 'alarm', path:'/assets/alarm.7a4fc8e4.png' },
  { name: 'balance-two', path: '/assets/balance-two.5da8ea02.png' },
  { name: 'bug', path: '/assets/bug.8483af4d.png' },
  { name: 'caution', path: '/assets/caution.7a91706b.png' },
  { name: 'fire-extinguisher', path: '/assets/fire-extinguisher.a23682b8.png' },
  { name: 'harm', path:'/assets/harm.67b2241c.png'},
  { name: 'key', path: '/assets/key.db9b8c9d.png' },
  { name: 'keyhole', path:'/assets/keyhole.480d4dfc.png'},
  { name: 'protect', path: '/assets/protect.3a399624.png' },
  { name: 'radiation', path: '/assets/radiation.c86bdd3d.png'},
  { name: 'umbrella', path: '/assets/umbrella.494c19bc.png'}
  ]);

  const closeEmoji = () => {
    isEmojiVisible.value = false;
  };

  const openEmoji = ()=>{
    isEmojiVisible.value = true;
  }

  return {
    isEmojiVisible,
    closeEmoji,
    openEmoji,
    emojiList
  };
});
